import React from 'react';
import css from './Loading.less';

const Loading = () => {
    const createCircle = (): React.ReactElement[] => {
        return [1, 2, 3, 4].map(item => <div key={item} className={css['circle' + item]} />)
    }
    const createSpinnerContainer = (): React.ReactElement[] => {
        return [1, 2, 3].map(item => {
            return (
                <div key={item} className={css['spinner-container'] + ' ' + css['container' + item]}>
                    {createCircle()}
                </div>
            )
        })
    }
    return (
        <div className={css.spinner}>
            {createSpinnerContainer()}
        </div>
    )
}

export default Loading